<div class="panel panel-primary">
    <div class="panel-heading">
        <h3 class="panel-title">Crear nuevo texto</h3>
    </div>
    <div class="panel-body">
        <form id="frmCrearTexto" class="form-horizontal" name="frmCrearTexto" method="POST" enctype="multipart/form-data" role="form">
            <div class="form-group">
                <!-- Titulo -->
                <label for="txtNombre" class="col-sm-2 control-label">Titulo</label>
                <div class="col-sm-4">
                    <input id="txtNombre" class="form-control" type="text" name="txtNombre" maxlength="255" placeholder="Nombre del texto" required="required">
                </div>
                <!-- Carrera -->
                <label for="ddlCarrera" class="col-sm-2 control-label">Carrera</label>
                <div class="col-sm-4">
                    <select id="ddlCarrera" class="form-control" name="ddlCarrera" required="required">
                        <option disabled="disabled" selected="selected">Carreras</option>
                        {combo_carreras}
                    </select>
                </div>
            </div>
            <div class="form-group">
                <!-- Autor -->
                <label for="txtAutor" class="col-sm-2 control-label">Autor</label>
                <div class="col-sm-4">
                    <input id="txtAutor" class="form-control" type="text" name="txtAutor" maxlength="100" placeholder="Autor">
                </div>
                <!-- Nivel -->
                <label for="ddlNivel" class="col-sm-2 control-label">Nivel</label>
                <div class="col-sm-4">
                    <select id="ddlNivel" class="form-control" name="ddlNivel" required="required">
                        <option disabled="disabled" selected="selected">Niveles</option>
                        {combo_niveles}
                    </select>
                </div>
            </div>
            <div class="form-group">
                <!-- Docente -->
                <label for="txtDocente" class="col-sm-2 control-label">Docente</label>
                <div class="col-sm-4">
                    <input id="txtDocente" class="form-control" type="text" name="txtDocente" maxlength="50" placeholder="Docente">
                </div>
                <!-- Materia -->
                <label for="ddlMateria" class="col-sm-2 control-label">Materia</label>
                <div class="col-sm-4">
                    <select id="ddlMateria" class="form-control" name="ddlMateria" required="required">
                        <option disabled="disabled" selected="selected">Materias</option>
                        {combo_materias}
                    </select>
                </div>
            </div>
            <div class="form-group">
                <!-- Codigo interno -->
                <label for="txtCodigo" class="col-sm-2 control-label">Codigo</label>
                <div class="col-sm-4">
                    <input id="txtCodigo" class="form-control" type="number" name="txtCodigo" min="0" max="65535" step="1" value="0">
                </div>
                <!-- Tipo contenido -->
                <label for="ddlTipoContenido" class="col-sm-2 control-label">Contenido</label>
                <div class="col-sm-4">
                    <select id="ddlTipoContenido" class="form-control" name="ddlTipoContenido" required="required">
                        <option disabled="disabled" selected="selected">Contenidos</option>
                        {combo_contenidos}
                    </select>
                </div>
            </div>
            <div class="form-group">
                <!-- PDF -->
                <label class="col-sm-2 control-label" for="fileTextoPDF">Archivo</label>
                <div class="col-sm-4">
                    <input type="hidden" name="MAX_FILE_SIZE" value="104857600" />
                    <input id="fileToUpload" class="form-control" type="file" name="fileToUpload" accept="application/pdf" required="required">
                    <p class="help-block">Este archivo debe ser un PDF y su tamaño menor o igual a 100 MiB.</p>
                </div>
                <!-- Activo -->
                <div class="col-sm-offset-2 col-sm-4">
                    <div class="checkbox">
                        <label for="chkActivo">
                            <input id="chkActivo" type="checkbox" name="chkActivo"> &iquest;Activo?
                        </label>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <!-- Imagen previsualizacion -->
                <label class="col-sm-2 control-label" for="filePreview">Previsualizaci&oacute;n</label>
                <div class="col-sm-4">
                    <input type="hidden" name="MAX_FILE_SIZE" value="1048576" />
                    <input id="filePreview" class="form-control" type="file" name="filePreview" accept="image/jpeg,image/png">
                    <p class="help-block">Este archivo debe ser una imagen y su tamaño menor o igual a 1 MiB.</p>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <button type="submit" class="btn btn-default" name="btnGuardar">
                        <span class="glyphicon glyphicon-save"></span> Guardar
                    </button>
                    <button type="reset" class="btn btn-default">Limpiar</button>
                </div>
            </div>
        </form>
    </div>
</div>
<script type="text/javascript">
    $("#ddlCarrera").change(function(e) {
        $.post("index.php?do=/textos/ajax_get_niveles",
        { idCarrera: $(this).val() },
        function(data, textStatus, jqHXR) {
            //alert(data);
            $('#ddlNivel').empty();
            $('#ddlNivel').append($('<option>').text('Niveles').attr('disabled', true));
            $('#ddlMateria').empty();
            $('#ddlMateria').append($('<option>').text('Materias').attr('disabled', true));
            
            $.parseJSON(data).map(function(value, key) {
                $('#ddlNivel').append($('<option>').val(value.IdNivel).text(value.Descripcion));
            });
            
            $('#ddlNivel').removeAttr('disabled');
            $('#ddlNivel').prop('selectedIndex', 0);
        }).fail(function(jqXHR, textStatus, errorThrown) {
            console.error(errorThrown);
        });
    });
    
    $("#ddlNivel").change(function(e) {
        $.post("index.php?do=/textos/ajax_get_materias",
        { idNivel: $(this).val() },
        function(data, textStatus, jqHXR) {
            //alert(data);
            $('#ddlMateria').empty();
            $('#ddlMateria').append($('<option>').text('Materias').attr('disabled', true));
            
            $.parseJSON(data).map(function(value) {
                $('#ddlMateria').append($('<option>').val(value.IdMateria).text(value.Descripcion));
            });
            
            $('#ddlMateria').removeAttr('disabled');
            $('#ddlMateria').prop('selectedIndex', 0);
        }).fail(function(jqXHR, textStatus, errorThrown) {
            console.error(errorThrown);
        });
    });
    
    /*var randIDS = "{UniqueID}";
    
    $("#frmCrearTexto").submit(function(e) {
        var p = $(this);
        p.attr('target', 'tmpForm');

        // creating iframe
        if ($("#tmpForm").length == 0) {
            var frame = $("<iframe>");

            frame.attr({
                name: 'tmpForm',
                id: 'tmpForm',
                action: 'about:blank',
                border: 0
            }).css('display', 'none');

            p.after(frame);
        }

        // Start file upload  
        $.post("index.php?do=/textos/ajax_upload_progress", {progressKey: randIDS, rand: Math.random()}, function(data) {
            $("#pnlErrorShow").html(data);
            
            var uploaded = parseInt(data);

            if (uploaded == 100)
            {
                //$(".progress, .badge").hide();
                clearInterval(loadLoader());
            }
            else if (uploaded < 100)
            {
                $("#pnlProgressBarContainer").show();
                $("#sUploadStatus").text(uploaded + "% completado");
                $(".progress-bar").css('width', uploaded + "%");
            }

            if (uploaded < 100)
            {
                setInterval(loadLoader(), 2000);
            }
        });

        function loadLoader()
        {
            $.post("index.php?do=/textos/ajax_upload_progress", {progressKey: randIDS, rand: Math.random()}, function(data) {
                var uploaded = parseInt(data);
                if (uploaded == 100)
                {
                    $("#pnlProgressBarContainer").hide();
                }
                else if (uploaded < 100)
                {
                    $("#pnlProgressBarContainer").show();
                    $("#sUploadStatus").text(uploaded + "% completado");
                    $(".progress-bar").css('width', uploaded + "%");
                    
                }
            });
        }
    });*/
</script>